I can not figure out how to import .js files into the commands.js file in an office js add-in.

Using the ES6 standard in the taskpane.js file was not a problem, for example in taskpane.js:

import * as tools from "./scripts/native/tools.js"

worked without any issues.

In commands.js, this way of importing won't work. I get a "SyntaxError: Unexpected token '*'. import call expects exactly one argument." error. I read that I should add type="module" in the commands.html file as such:

<script type="module" src="commands.js" type="text/javascript"></script> 

This breaks the ribbon-commands functionality and I get a new error: "Failed to load resource: the server responded with a status of 404 (Not Found)".

However, if I mistype the path on purpose I get the following new error "[webpack-dev-server] ERROR in ./src/commands/commands.js 17:0-52 Module not found: Error: Can't resolve './scripts/native/toolss.js' in '/Users/eberhardtkorf/dev/redacted/new/src/commands'".

This makes it seem like the file can be found, but for some reason it won't be imported as an external module.

A way around this is to write all code in the commands.js file, but this is not scalable and not desirable.

Any help will be appreciated.